<template>
    <h2>用户购买理财页面</h2>
    <table class="table table-bordered">
        <tr>
            <td>理财产品名称</td>
            <td>
                {{ info.F_name }}
            </td>
        </tr>
        <tr>
            <td>年收益</td>
            <td>
                {{ info.F_APY }}
            </td>
        </tr>
        <tr>
            <td>最低金额</td>
            <td>
                {{ info.F_MinMoney }}
            </td>
        </tr>
        <tr>
            <td>风险等级</td>
            <td>
                {{ info.F_Level == 0 ? "低风险" : info.F_Level == 1 ? "中风险" : "高风险" }}
            </td>
        </tr>
        <tr>
            <td>购买金额</td>
            <td>
                <input type="text" v-model="BuyMoney" />
            </td>
        </tr>
        <tr>
            <td>每年预计收益额</td>
            <td>
                {{ (Number(BuyMoney) * info.F_APY / 100).toFixed(2) }} CNY
            </td>
        </tr>
        <tr>
            <td colspan="2">

                <button @click="saveUserFinan">保存</button>
            </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import axios from 'axios'
import { useUserStore } from '../../store/index.ts';

const route = useRoute();
const router = useRouter();
const userStore = useUserStore();
//创建响应式数据 接收反填数据
const info = ref(
    {
        F_id: '',
        F_name: '',
        F_APY: 0,
        F_MinMoney: 0,
        F_Level: 0
    }
);
//购买金额
const BuyMoney = ref('');
onMounted(() => {
    loadData();
})
//加载数据
const loadData = () => {
    axios.get("https://localhost:44387/api/Finans/Detail", {
        params: {
            F_id: route.query.F_id
        }
    })
        .then(res => {
            console.log(res.data);
            info.value = res.data;

        })
        .catch(err => {
            console.log(err);
        })
};
//保存用户理财信息
const saveUserFinan = () => {
    //判断理财金额必须大于最低理财金额
    if (Number(BuyMoney.value) < info.value.F_MinMoney) {
        alert("理财金额必须大于最低理财金额");
        return;
    }
    axios.post("https://localhost:44387/api/Finans/AddUserFinanInfo", {
        F_id: route.query.F_id,
        UF_Money: BuyMoney.value,
        U_Id: userStore.UserId
    }).then(res => {
        console.log(res.data);
        if (res.data >0) {
            alert("用户理财成功");
            router.push("/ShowUserFinan");
        } else {
            alert("用户理财失败");
        }
    })
        .catch(err => {
            console.log(err);
        })
}



</script>
